<template>
  <div>
    显示消息：{{ mes }}
    <el-input v-model="sendsms"></el-input>
    <el-button @click="send">submit</el-button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      mes: "",
      ws: "",
      sendsms: "",
    };
  },
  methods: {
    initWebsocket() {
      this.ws = new WebSocket("ws://localhost:8000/websocket?id=1");
      this.ws.onopen = function () {
        alert("success");
      };
      this.ws.onmessage = (data) => {
        this.mes = data.data;
      };

      this.ws.onclose = function () {
        alert("close");
      };
    },
    send() {
      this.ws.send(this.sendsms);
    },
  },
  mounted() {
    this.initWebsocket();
  },
};
</script>

<style>
</style>
